<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>限定输入内容</title>
	</head>

	<body>
		<form>
			年份:<input type="text" name="year" /><span id="yearError"></span>
			<br /> 月份:
			<input type="text" name="mouth" /><span id="mouthError"></span>
			<br />
			<button>查询</button>
		</form>
		<script>
			
			var inputs = document.getElementsByTagName('input')
			var yearError = document.getElementById('yearError')
			var mouthError = document.getElementById('mouthError')

			function checkYear(obj) {
				var str = obj.value;
				var reg = /^\d{4}$/;
				if(!str.match(reg)) {
					yearError.innerHTML = "输入错误，年份为4位数字";
				} else {
					yearError.innerHTML = "";
				}
			}
			
			inputs[0].onblur = function() {
				checkYear(this);
			}

			function checkMouth(obj) {
				var str = obj.value;
				var reg = /^(0?[1-9]|1[0-2])$/;
				
				if(!str.match(reg)) {
					mouthError.innerHTML = "输入错误，月份为1-12"
				} else {
					mouthError.innerHTML = "";
				}
			}
			inputs[1].onblur = function() {
				checkMouth(this);
			}
		</script>
	</body>

</html>